import axios from 'axios'
import { Message } from 'element-ui'
import store from '@/store'
import router from '@/router'

// create an axios instance
const service = axios.create({
  // 后台请求基础地址(动态)
  /**
   * process.env环境变量(是一个对象) -> node中的概念
   * 前端不存在这个概念,由webpack注入,是node中的数据
   * 1.development 开发环境 -> 后台地址dev,例如 localhost:3000/api -> 临时
   * 2.production 生产环境 -> 后台地址prod,例如 http://ihrm-java.itheima.net/api -> 正式
   * 3.staging 灰度环境
   * 优点:可以无缝切换不同环境的请求地址,将来方便修改请求地址
   */
  baseURL: process.env.VUE_APP_BASE_API // url = base url + request url
  // withCredentials: true, // send cookies when cross-domain requests
  // timeout: 5000 // request timeout -> 超过5000ms,中断请求
})

// request interceptor
// 发请求之前执行
service.interceptors.request.use(
  config => {
    // do something before request is sent
    // 统一添加token
    if (store.getters.token) {
      // 等同于store.state.user.token
      // let each request carry token
      // ['X-Token'] is a custom headers key
      // please modify it according to the actual situation
      config.headers.Authorization = `Bearer ${store.getters.token}`
    }
    return config
  },
  error => {
    // do something with request error
    console.log(error) // for debug
    return Promise.reject(error)
  }
)

// response interceptor
// 请求成功后先执行(页面还没有拿到数据)
service.interceptors.response.use(
  /**
   * If you want to get http information such as headers or status
   * Please return  response => response
  */

  /**
   * Determine the request status by custom code
   * Here is just an example
   * You can also judge the status by HTTP Status Code
   */
  response => {
    // const res = response.data
    // 因为即使参数传错,后台也会返回200,通过success这个布尔值判断请求是否成功,所以在这里处理异常
    const { success, message, data } = response.data
    if (success) {
      // 请求成功
      // 给页面返回数据
      return data
    } else {
      // 请求失败
      // 错误提示
      Message({
        message: message,
        type: 'error',
        duration: 3 * 1000
      })
      // 对外抛出错误(重要!!!)
      return Promise.reject(new Error(message))
    }
    // 给页面返回数据
    // return res
  },
  // 正常情况下,200以外走这里
  error => {
    console.dir(error) // for debug
    // error.conifg带有上次请求的数据, 在移动端中如果要使用refresh_token刷新token, 更新token后就可以return request(error.config)
    /**
     * 需求:出现401,重新登录
     * 实现:
     * 1.判断401情况
     * 2.删除之前登录存储的数据
     * 3.错误提示
     * 4.跳转登录页(携带出现401页面的地址 -> 重新登录后回到上次访问的页面)
     */
    if (error.response && error.response.status === 401) {
      // 处理某些页面多个请求多次401重复跳转问题，造成重新登录后不能正确跳转到上次访问页面问题
      if (router.currentRoute.path === '/login') return
      store.dispatch('user/logoutAction')
      // 错误提示
      Message({
        message: error.response.data.message + ' 请重新登陆',
        type: 'error',
        duration: 3 * 1000
      })
      // js通过router.currentRoute.path获取当前页面地址
      router.replace(`/login?redirect=${router.currentRoute.path}`)
    }
    return Promise.reject(error)
  }
)

export default service
